﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>培训内容覆盖量统计</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../../../static/css/font.css">
    <link rel="stylesheet" href="../../../static/css/weadmin.css">
    <link href="../../lib/layui/css/layui.css" rel="stylesheet" />
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>

    <div class="weadmin-nav">
        <span class="layui-breadcrumb" style="visibility: visible;">
            <a href="#">首页</a><span lay-separator="">/</span>
            <a href="#">查询统计</a><span lay-separator="">/</span>
            <a><cite>内容学习覆盖量统计</cite></a>
        </span>
        <a class="layui-btn layui-btn-sm" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
            <i class="layui-icon" style="line-height:30px">ဂ</i>
        </a>
    </div>


    <div class="weadmin-body">

        <div class="layui-form">
            <div class="layui-form-item">
                <div class="layui-row">
                    <label class="layui-form-label">培训计划:</label>
                    <div class="layui-input-inline" style="width:550px">
                        <select id="TPID" name="TPID" class="valid" lay-filter="TPID"></select>
                    </div>

                    <label class="layui-form-label">培训内容:</label>
                    <div class="layui-input-inline" style="width:400px">
                        <select id="TContent" name="TContent" class="valid" lay-filter="TContent"></select>
                    </div>

                    <div class="layui-input-inline" style="width:100px;display:none;">
                        <button type="button" class="layui-btn layui-btn-primary" id="find" name="查询"><i class="layui-icon">&#xe615;</i>查询</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="left-nav" style=" left :10px; top:100px; bottom:0px; padding-top: 0px;width:150px">
            <div id="side-nav">
                <div class="layui-form">
                    <ul id="nav"></ul>
                </div>
            </div>
        </div>
        <!--<div class="page-content" style="top:94px; bottom:20px;left:220px">-->
        <div class="page-content" style="border:0px solid #f00; top:94px; bottom:20px;left:170px;overflow:auto">
            <!--<div class="layui-tab-content">-->
            <!--<div class="layui-tab-item layui-show">-->
            <table id="memberList" lay-filter="memberList"></table>
            <!--</div>-->
            <!--</div>-->
        </div>

    </div>

    <script src="../../../lib/layui/layui.js" charset="utf-8"></script>

    <script>
        layui.use(['table', 'form', 'layer'], function () {
            var table = layui.table,
                layer = layui.layer,
                form = layui.form,
                $ = layui.jquery;

            //获取页面角色id，并根据角色id获取对应模块，并进行对应的遍历绑定
            $('ul').on('click', 'li', function () {
                roleid = $(this).attr('id');//获取到绑定的li的id即roleid
                $.each($("#nav li"), function () {
                    $(this).css("background", "RGB(238,238,238)");
                });
                $(this).css("background", "rgb(47,162,147)");

                if ($("#TContent").val() == "") {
                    layer.msg("请选择培训内容！");
                    return;
                }
                else {
                    //showList(searchlevel);
                    var searchlevel = roleid.toString().substring(roleid.length - 1);
                    //layer.msg(roleid + '--' + searchlevel);
                    showList(searchlevel);
                }

                //var postdata = { "RoleID": roleid };
                ////post请求api得到该角色所拥有模块并进行对应绑定
                //$.post(ApiUrl + 'RolePower/GetModuleByRoleID', postdata, function (data) {
                //    if (data.StatusCode == 200) {
                //        //赋值给界面列表
                //        $(function () { showList(data.Data); })
                //    } else {
                //        layer.msg(data.Info);
                //    }
                //});
            });

            function showrole() {
                var rolearray = ['车间', '车队', '乘务员'];
                for (var i = 0; i < rolearray.length; i++) {

                    var htmlmenu = "";
                    htmlmenu += '<li id="' + 'role' + (i + 1).toString() + '"  >';
                    htmlmenu += '<a href="javascript:;"><i class="iconfont">&#xe6b8;</i><cite >' + rolearray[i] + '</cite></a>';
                    htmlmenu += "</li>";
                    $("#nav").append(htmlmenu);
                }
            }

            function showList(searchlevel) {
                var myCols;
                var tcName = $("#TContent").find("option:selected").text();

                var title_chejianchedui = [
                    { type: 'checkbox' },
                    {
                        field: 'TPName1', title: '内容名称', width: 350, totalRowText: '合计', templet: function (d) {
                            return tcName;
                        }
                    },
                    { field: 'DeptID', title: '部门ID', hide: true },
                    { field: 'DepName', title: '部门名称' },
                    { field: 'yingpeizongrenci', title: '应培总人次', totalRow: true },
                    {
                        field: 'yipeizongrenci', title: '已培总人次', totalRow: true
                        //, templet: function (d) {
                        //    if (d.studyusernum < d.needtrainnum) {
                        //        return '<div style="background:red; color: #FFFFFF">' + d.studyusernum + '</div>'
                        //    }
                        //    else return d.studyusernum
                        //}
                    },
                    {
                        field: 'weipeizongrenci', title: '未培总人次', totalRow: true
                    },
                    { field: 'fugailv', title: '覆盖率(%)' },
                    //{ field: 'IsEnd', title: '计划状态'}
                ]

                var title_chengwuyuan = [
                    { type: 'checkbox' },
                    {
                        field: 'TPName1', title: '内容名称', totalRowText: '合计', templet: function (d) {
                            return tcName;
                        }
                    },
                    { field: 'DeptID', title: '部门ID', hide: true },
                    { field: 'UserName', title: '人员名称', width: 100 },
                    { field: 'yingpeirenci', title: '应培人次', width: 100, totalRow: true },
                    {
                        field: 'yipeirenci', title: '已培人次', width: 100, totalRow: true
                        //, templet: function (d) {
                        //    if (d.studyusernum < d.needtrainnum) {
                        //        return '<div style="background:red; color: #FFFFFF">' + d.studyusernum + '</div>'
                        //    }
                        //    else return d.studyusernum
                        //}
                    },
                    {
                        field: 'weipeirenci', title: '未培人次', width: 100, totalRow: true,
                        templet: function (d) {
                            if (d.weipeirenci <= 0) {
                                return '<div>' + d.weipeirenci + '</div>'
                            }
                            else {
                                return d.weipeirenci;
                            }

                        }
                    }
                ]

                if (searchlevel == 1 || searchlevel == 2) {
                    myCols = title_chejianchedui;
                }
                if (searchlevel == 3) {
                    myCols = title_chengwuyuan;
                }

                var tc = $("#TContent").find("option:selected").text().split('\n')[0];
                var tcSub = tc.length > 100 ? tc.substr(0, 100) : tc;
                var swhere = JSON.stringify({
                    TPID: $("#TPID").val(),
                    TContent: tcSub,
                    searchLevel: searchlevel
                });
                table.render({
                    id: "memberList",
                    elem: '#memberList',
                    //method:'post',
                    url: ApiUrl + 'TrainPlanAndContentStudyRate/TrainContentStudyRate', //数据接口,
                    headers: {
                        "userid": JSON.parse(window.localStorage.authInfo).UserId,
                        "signtoken": JSON.parse(window.localStorage.authInfo).SignToken,
                    },
                    where: { swhere: swhere },
                    cellMinWidth: 80,
                    totalRow: true,
                    toolbar: "#toolbar",
                    cols: [myCols],
                    parseData: function (res) { //res 即为原始返回的数据
                        console.log(res.Data)
                        return {
                            "code": res.StatusCode, //解析接口状态
                            "msg": res.Info, //解析提示文本
                            "count": res.Count, //解析数据长度
                            "data": res.Data //解析数据列表
                        };
                    },
                    response: { statusCode: 200 },//规定成功的状态码，默认：0
                    event: true,
                    //page: true,
                    limit: 15,
                    done: function (res, curr, count) {
                        if (res.code == 200) {
                            if (res.data != null) {
                                for (var i = 0; i < res.data.length; i++) {
                                    if (res.data[i].weipeirenci == 1) {
                                        var td = $('.layui-table-body tbody tr[data-index="' + i + '"] td[ data-field="UserName"]')
                                        td.css('background-color', 'rgb(255,0,0)');
                                        td.css('color', 'black');
                                        var td = $('.layui-table-body tbody tr[data-index="' + i + '"] td[ data-field="weipeirenci"]')
                                        td.css('background-color', 'rgb(255,0,0)');
                                        td.css('color', 'black');
                                    }
                                }
                            }
                        }
                        //res.data.forEach(function (item, index) {
                        //    if (item.studyusernum < item.needtrainnum) {
                        //        var tr = $('.layui-table-body tbody tr[data-index="' + index + '"]');
                        //        var td = $('.layui-table-body tbody tr[data-index="' + index + '"] td[ data-field="studyusernum"]')
                        //        tr.css('background-color', 'red');
                        //        tr.css('color', 'black');
                        //        //tr.each(function () {
                        //        //    var text = $(this).text();
                        //        //    if (text > 30 && text < 50) {
                        //        //        $(this).css('background-color', 'rgba(251,230,160,0.5)');
                        //        //    } else if (text > 50 && text < 80) {
                        //        //        $(this).css('background-color', 'red');
                        //        //    }
                        //        //});
                        //    }
                        //});
                        //如果是异步请求数据方式，res即为你接口返回的信息。
                        //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
                        if (res.code == 401) {
                            //layer.msg(res.msg);
                        }
                        if (res.code == 403) {
                            layer.alert(res.msg, function () {
                                top.location.href = '../../login.html';
                            })
                        }
                    }
                });
            }

            $(function () {
                showrole();
                showList();
            });

            //加载部门信息，角色信息，机务段信息
            $.ajax({
                url: ApiUrl + "TrainPlan/Sel",
                type: 'get',
                headers: {
                    "userid": JSON.parse(window.localStorage.authInfo).UserId,
                    "signtoken": JSON.parse(window.localStorage.authInfo).SignToken,
                },
                success: function (data) {
                    if (data.StatusCode == 200) {
                        $("#TPID").append("<option value=''></option>");
                        $(data.Data).each(function (index, item) {
                            $("#TPID").append("<option value='" + item.TPID + "'>" + item.TPName + "</option>");
                        });
                        form.render();//必须，不然动态加载项不显示
                    }
                    else if (data.StatusCode == 403) {
                        layer.alert(data.Info, function () {
                            location.href = '../../login.html';
                        })
                    }
                    else {
                        layer.msg(data.Info);
                    }
                }
            });


            form.on('select(TPID)', function (data) {

                var tpid = $("#TPID").val();


                //加载部门信息，角色信息，机务段信息
                $.ajax({
                    url: ApiUrl + "TrainCourseFiles/GetContent?TPID=" + tpid,
                    type: 'get',
                    headers: {
                        "userid": JSON.parse(window.localStorage.authInfo).UserId,
                        "signtoken": JSON.parse(window.localStorage.authInfo).SignToken,
                    },
                    success: function (data) {
                        if (data.StatusCode == 200) {
                            $("#TContent").empty();
                            $("#TContent").append("<option value=''></option>");
                            if (data.Data.length > 0) {
                                $(data.Data).each(function (index, item) {
                                    $("#TContent").append("<option value='" + index + "'>" + item.TContent + "</option>");
                                });
                                form.render();//必须，不然动态加载项不显示
                            }
                        }
                        else if (data.StatusCode == 403) {
                            layer.alert(data.Info, function () {
                                location.href = '../../login.html';
                            })
                        }
                        else {
                            layer.msg(data.Info);
                        }
                    }
                });

            })
        });
    </script>
</body>
</html>